// 导航守卫
import router from '@/router'
import store from '@/store'
import { Message } from 'element-ui'

// 全局前置守卫
router.beforeEach(async(to, from, next) => {
  // 测试注释2
  const maxTime = 1000 * 60 * 60 * 2
  const time = localStorage.getItem('time')
  const now = Date.now()
  if (time && now - time > maxTime) {
    // console.log('跳转页面时间', now)
    // console.log('登录时间', time)
    // console.log('间隔时间', now - time)
    // 当前时间减去登录时间已经超过定好的范围
    // 马上退出(记得把上次登录时间也给清理)
    localStorage.removeItem('time')
    Message.error('超时(主动), 请重新登入')
    store.commit('user/logout')
    next('/login')
  }
  // to 目标地址, from 来源地址, next 放行回调函数
  // 导航守卫跟拦截器一样, 拦住了记得要放行
  // 通过vuex user token可以知道当前登录状态
  const token = store.state.user.token

  if (token) {
    // 已登录
    // 人资当中有个可选的功能, 如果已经登录不能再进入登录页
    if (to.path === '/login') {
      // 1 登录以后还去登录页 -> 跳回首页
      next('/')
    } else {
      // 2 登录以后进入登录页以外页面 -> 放行
      // 在进入页面的时候, 如果发现当前的用户数据不存在
      // 就要调用 action 获取 数据
      const username = store.state.user.userInfo.username
      if (!username) {
        // 先等待个人数据拿完, 保证数据都赋值完毕了才能继续往下走
        // action 的调用本来就是 promise 只需要 async / await 即可
        await store.dispatch('user/getUserInfo')

        // 就在这个地方, 保证已经登录
        // 保证正常进入普通页面
        // 保证用户数据已经获取得到
        // 路由筛选调用 vuex
        // 上面确保了员工数据拿到, 这里传入vuex里面使用
        console.log('导航守卫进入页面之前调用筛选路由的 vuex action')
        const menus = store.state.user.userInfo.roles.menus
        // 调用了action筛选了路由, 拼接了菜单
        // 还要拿到筛选的结果, 追加到 路由实例 router 里面
        // 利用 router.addRoutes
        const res = await store.dispatch('permission/filterRoutes', menus)
        router.addRoutes([
          ...res,
          { path: '*', redirect: '/404', hidden: true }
        ])
        // 每当追加路由的时候, 是比确定页面组件要晚, 已经没法改变页面显示了(刷新会空白)
        // 解决的办法是,拿到当前想要去的目标地址, 重新进入一次即可
        next(to.path)
      }
      next()
    }
  } else {
    // 未登录跳到登录页
    // 如果你本来就是去登录页, 应该放行
    // 否则才跳到登录页
    // if (to.path === '/login' || to.path === '/404' || to.path === '/testpage') {
    // 上面 or 写法有点复杂, 可以用白名单思路实现, 如果找得到下标, 那么就是数组中字符串其中一个
    const pathArray = ['/login', '/404', '/testpage']
    if (pathArray.indexOf(to.path) !== -1) {
      // 3 未登录在白名单->放行
      next()
    } else {
      // 4 未登录不在白名单 -> 登录页
      next('/login')
    }
  }
})
